/*------------------------------------*
    #UPLOADER
/*------------------------------------*

.webuploader-container
  position: relative

.webuploader-element-invisible
  position: absolute !important
  clip: rect(1px,1px,1px,1px)

.webuploader-pick
  position: relative
  display: inline-block
  cursor: pointer
  background-color: $brand-primary
  padding: 10px 15px
  color: #fff
  text-align: center
  border-radius: 3px
  overflow: hidden

.webuploader-pick-hover
  background-color: darken($brand-primary, 10%)

.webuploader-pick-disable
  opacity: 0.6
  pointer-events: none


#uploader .queueList
  margin: 20px

.element-invisible
  position: absolute !important
  clip: rect(1px,1px,1px,1px)

#uploader .placeholder
  position: relative
  min-height: 238px
  border: 3px dashed #e6e6e6
  padding-top: 158px
  text-align: center
  background: image_url('image.png') no-repeat center 93px
  color: #ccc
  font-size: 18px

#uploader .placeholder .webuploader-pick
  font-size: 18px
  background-color: $brand-primary
  border-radius: 3px
  line-height: 44px
  padding: 0 30px
  color: #fff
  display: inline-block
  margin: 20px auto
  cursor: pointer
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1)

#uploader .placeholder .webuploader-pick-hover
  background-color: $brand-primary

#uploader .placeholder .flashTip
  color: #666
  font-size: 12px
  position: absolute
  width: 100%
  text-align: center
  bottom: 20px

#uploader .placeholder .flashTip a
  color: #0785d1
  text-decoration: none

#uploader .placeholder .flashTip a:hover
  text-decoration: underline

#uploader .placeholder.webuploader-dnd-over
  border-color: #999

#uploader .placeholder.webuploader-dnd-over.webuploader-dnd-denied
  border-color: red

#uploader .filelist
  list-style: none
  margin: 0
  padding: 0

#uploader .filelist:after
  content: ''
  display: block
  width: 0
  height: 0
  overflow: hidden
  clear: both

#uploader .filelist li
  width: 110px
  height: 110px
  background: image_url('bg.png') no-repeat
  text-align: center
  margin: 0 8px 20px 0
  position: relative
  display: inline
  float: left
  overflow: hidden
  font-size: 12px

#uploader .filelist li p.log
  position: relative
  top: -45px

#uploader .filelist li p.title
  position: absolute
  top: 5px
  left: 0
  width: 100%
  overflow: hidden
  white-space: nowrap
  text-overflow: ellipsis
  text-indent: 5px
  text-align: left

#uploader .filelist li p.progress
  position: absolute
  width: 100%
  bottom: 0
  left: 0
  height: 8px
  overflow: hidden
  z-index: 50

#uploader .filelist li p.progress span
  display: none
  overflow: hidden
  width: 0
  height: 100%
  background: #1483d8 image_url('progress.png') repeat-x
  +transition (width 200ms linear)
  +animation (progressmove 2s linear infinite)
  +transform (translateZ(0))

+keyframes (progressmove)
  0%
    background-position: 0 0
  100%
    background-position: 17px 0

#uploader .filelist li p.imgWrap
  position: relative
  z-index: 2
  line-height: 110px
  vertical-align: middle
  overflow: hidden
  width: 110px
  height: 110px
  +transform-origin (50% 50%)
  +transition (200ms ease-out)

#uploader .filelist li img
  width: 100%

#uploader .filelist li p.error
  position: absolute
  bottom: 0
  left: 0
  width: 100%
  height: 28px
  background-color: #f43838
  color: #fff
  line-height: 28px
  z-index: 100

#uploader .filelist li .success
  display: block
  position: absolute
  bottom: 0
  left: 0
  width: 100%
  height: 40px
  background: image_url('success.png') no-repeat right bottom
  z-index: 200

#uploader .filelist div.file-panel
  position: absolute
  top: 0
  left: 0
  width: 100%
  height: 0
  background-color: rgba( 0, 0, 0, 0.5 )
  overflow: hidden
  z-index: 300

#uploader .filelist div.file-panel span
  display: inline
  float: right
  width: 24px
  height: 24px
  background: image_url('icons.png') no-repeat
  margin: 5px 1px 1px
  cursor: pointer
  overflow: hidden
  text-indent: -9999px

#uploader .filelist div.file-panel span.rotateLeft
  background-position: 0 -24px

#uploader .filelist div.file-panel span.rotateLeft:hover
  background-position: 0 0

#uploader .filelist div.file-panel span.rotateRight
  background-position: -24px -24px

#uploader .filelist div.file-panel span.rotateRight:hover
  background-position: -24px 0

#uploader .filelist div.file-panel span.cancel
  background-position: -48px -24px

#uploader .filelist div.file-panel span.cancel:hover
  background-position: -48px 0

#uploader .statusBar
  position: relative
  height: 63px
  border-top: 1px solid #dadada
  padding: 0 20px
  line-height: 63px
  vertical-align: middle

#uploader .statusBar .progress
  position: relative
  display: inline-block
  width: 198px
  height: 18px
  margin-right: 10px
  background-color: #fff
  border: 1px solid #1483d8
  text-align: center
  line-height: 20px
  color: #6dbfff

#uploader .statusBar .progress span.percentage
  position: absolute
  width: 0
  height: 100%
  left: 0
  top: 0
  background-color: #1483d8

#uploader .statusBar .progress span.text
  position: relative
  z-index: 10

#uploader .statusBar .info
  display: inline-block
  font-size: 14px
  color: #666

#uploader .statusBar .btns
  position: absolute
  top: 10px
  right: 20px
  line-height: 40px

#filePicker2
  display: inline-block
  float: left

#uploader .statusBar .btns .webuploader-pick,
#uploader .statusBar .btns .uploadBtn,
#uploader .statusBar .btns .uploadBtn.state-uploading,
#uploader .statusBar .btns .uploadBtn.state-paused
  float: left
  display: inline-block
  padding: 0 18px
  background: #fff
  border: 1px solid #cfcfcf
  color: #565656
  border-radius: 3px
  margin-left: 10px
  cursor: pointer
  font-size: 14px

#uploader .statusBar .btns .webuploader-pick-hover,
#uploader .statusBar .btns .uploadBtn:hover,
#uploader .statusBar .btns .uploadBtn.state-uploading:hover,
#uploader .statusBar .btns .uploadBtn.state-paused:hover
  background-color: #f0f0f0

#uploader .statusBar .btns .uploadBtn
  background-color: #00b7ee
  color: #fff
  border-color: transparent

#uploader .statusBar .btns .uploadBtn:hover
  background-color: #00a2d4

#uploader .statusBar .btns .uploadBtn.disabled
  pointer-events: none
  opacity: 0.6
